<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta name="format-detection" content="telephone=no" />
    <meta name="format-detection" content="email=no" />
    <title>店铺</title>
    <link rel="stylesheet" href="../../css/api.css">
    <link rel="stylesheet" href="../../css/vant.css">
    <link rel="stylesheet" href="../../css/main.css">
    <style>

    </style>
</head>

<body>
    <div class="app" >
        <div class="order-list" v-if="listSellOrder&&listSellOrder.length>0">
            <div class="order-item" style="padding-bottom: 0"
                 :class="index == listSellOrder.length - 1?'order-item-pb':''"
                 v-for="(item, index) in listSellOrder" :key="index" @click="goPage(item.id)">
                <div class="f1 flex-x-sb">
                    <div style="font-size: 0.14rem">{{item.shopName}}</div>
                     <div style="font-size: 0.12rem">{{item.statusText}}</div>
                </div>
                <div class="f2 flex-x-sb" style="margin-bottom: 0.04rem" v-for="(it,idx) in item.orderItems" :key="idx">
                    <div class="order-info flex-x-s">
                        <img :src="it.imageUrl" alt="">
                        <div class="order-info-txt">
                            <div class="title">{{it.name}}</div>
                            <div class="money"><span>¥</span>{{it.price}}</div>
                        </div>
                    </div>
                    <div>x {{it.quantity}}</div>
                </div>
            </div>
        </div>
        <div v-else class="collect-empty">
            <img src="https://zzzzkj.oss-cn-shanghai.aliyuncs.com/static/tiexie/app/image/image/empty/empty.png" alt="">
            <div>暂无内容～</div>
        </div>
    </div>
    <script src="../../script/api.js"></script>
    <script src="../../script/flexible.js"></script>
    <script src="../../script/vue.min.js"></script>
    <script src="../../script/iconfont.js"></script>
    <script src="../../script/fastclick.js"></script>
    <script src="../../script/vant.min.js"></script>
    <script src="../../script/common.js"></script>
    <script src="../../script/restful.js"></script>
    <script src="../../script/businessCommon.js"></script>

    <script>
        apiready = function() {
            var vm = new Vue({
                el: '.app',
                data: {
                    listSellOrder: [],
                    queryParam: {
                        pageNum: 1,
                        pageSize: 10,
                        orderStatuses:null
                    },
                    hasNext: false,

                },
                mounted() {
                    this.getListSellOrder()
                },
                methods: {
                    getListSellOrder() {
                        var vm = this;
                        order('getListSellOrder')(vm.queryParam,function(ret){
                            vm.hasNext = ret.data.hasNext
                            if(vm.queryParam.pageNum == 1){
                                vm.listSellOrder = ret.data.list
                            }else{
                                vm.listSellOrder = vm.listSellOrder.concat(ret.data.list)
                            }
                            console.log("出售订单："+JSON.stringify(ret))
                        })
                    },
                    goPage(id) {
                        api.openWin({
                            name: 'order_detail_win',
                            url: 'order_detail_win.html',
                            bounces: false,
                            pageParam: {
                                id: id
                            }
                        });
                    }
                },
            })
            api.addEventListener({
                name: 'orderType'
            }, function(ret, err) {
                var active = ret.value.active
                if(active == 0){
                    vm.queryParam.orderStatuses = ''
                }else if (active == 1){
                    vm.queryParam.orderStatuses = '0'
                }else if (active == 2){
                    vm.queryParam.orderStatuses = '1'
                }else if (active == 3){
                    vm.queryParam.orderStatuses = '2'
                }else if (active == 4){
                    vm.queryParam.orderStatuses = '5,6,7,8,9,10'
                }
                vm.queryParam.pageNum = 1
                vm.getListSellOrder()
            });

            api.setRefreshHeaderInfo({
                bgColor: '#f7f7f7',
                textDown: '下拉更新有惊喜',
                textUp: '松开可以刷新'
            }, function (ret, err) {
                vm.queryParam.pageNum = 1
                vm.getListSellOrder()
                api.refreshHeaderLoadDone()
            });

            api.addEventListener({
                name: 'scrolltobottom',
                extra: {
                    threshold: -10
                }
            }, function (ret, err) {
                if (vm.hasNext) {
                    vm.queryParam.pageNum++
                    vm.getListSellOrder()
                }
            });

        }
    </script>
</body>

</html>
